<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>电子服务单</title>
    <!--startprint-->
    <style>
        body{margin: 0; padding: 0;}
        p{
            margin-bottom:0px!important;
            margin-top: 0!important;
        }
        .tongyin{width:850px;background:color('white');margin: 0 auto; overflow: hidden;padding-bottom:10px}
        .tongyin_bg{background:url("{$site.bjd_bj}");background-size:100%; position: relative;
            /*padding-bottom: 280px;*/

        }
        .ty-head{width: 100%;height: 60px; margin-top: 50px;}
        .logo{height: 56px;
            float: left;
            margin-top: 20px;
            width: 100%;
            text-align: center;
        }
        .logo img{height:56px;margin: 0 5px;}
        .ty-head .text{
            float:right;
            font-weight:bold;

        }
        .ty-head font{
            margin:10px 5px;
            font-size: 12px;
            font-weight: bold;
            float: right;
        }
        .t-title{
            width:708px;
            margin: 0 auto;
            overflow: hidden;
        }
        .t-title h2{
            text-align: center;
            font-weight: normal;
            font-family: "微软雅黑";

        }
        .t-title .title-right{
            width:100%;
            overflow: hidden;
        }
        .title-right span{
            display: block;
            font-size: 14px;
        }
        .sp1{
            width: 200px;
            float: left;
        }
        .sp2{
            width: 270px;
            float: left;
        }
        .t-title p{
            text-indent: 2rem;
        }
        table{
            width: 780px;
            /*height:800px;*/
            margin: 0 auto;
            font-size: 14px;
            text-align: center;

        }
        table td{
            padding:0 5px;
        }

        table tr td{
            width: 200px;
            /*width: 45.7px;*/
            height:30px;
        }
        table tr:nth-child(1) td:nth-child(1){
            width:60px;
        }
        table tr:nth-child(1) td:nth-child(2){
            width: 240px;
        }
        table tr:nth-child(1) td:nth-child(3){
            width: 220px;
        }
        table tr:nth-child(1) td:nth-child(4){
            width: 80px;
        }
        table tr:nth-child(2) td:nth-child(4){
            width: 80px;
        }
        table tr:nth-child(4) td:nth-child(4){
            width:40px;
        }
        table tr:nth-child(4) td:nth-child(5){
            width: 100px;
        }
        table tr:nth-child(7) td:nth-child(1){
            width:250px;
        }
        table tr:nth-child(7) td:nth-child(2){
            width:50px;
        }
        table tr:nth-child(7) td:nth-child(3){
            width:200px;
        }
        table tr:nth-child(7) td:nth-child(4){
            width:100px;
        }
        .btnn{
            position: relative;
            display: inline-block;
        }
        .file_btn{
            background: #3683D3;color: #fff; margin: 10px; padding: 10px; border: none;
            display: inline-block;
            font-size: 13px;
        }
    </style>
</head>
<body style="background-color: #fff;">
<div style="display:flex;    justify-content: center;">
    <div align="center"><input type="button" value="导出PDF" style="background: #3683D3;color: #fff; margin: 10px; padding: 10px; border: none;" onclick="exportPdf(this);"></div>
</div>
<div class="tongyin" id="tongyin">
    <div class="tongyin_bg">
        <div class="ty-head">
            <div class="logo">

                <div class="text" style="width: 100%;text-align: center;display:flex;">
                    <img id="" src="{$site.bjd_logo}" alt="" style="width: 121px;height: auto;position: absolute;left: 52px;top: -24px;"/>

                    <div style="font-size: 14px;font-weight: 400;margin-top: -20px;position: absolute;left: 50px;top: 144px;">
                        服务热线:<span style="color:red">{$site.bjd_phone}</span>
                    </div>
                    <div style="margin:0 auto">
                        <h1 style="color: #0a0a0a;font-size: 28px; margin: 0 auto;display: initial;">机动车交通安全综合服务</h1>
                    </div>
                    <img id="" src="{$site.bjd_ewm}" alt="" style="width:110px;height:110px;    position: absolute;right: 60px;top: 10px;"/>
                </div>
            </div>
        </div>
        <!--标题-->
        <div class="t-title">
            <h2 style="margin:10px 0;font-size: 20px">电子单（正本）</h2>
            <div class="title-right" style="margin-bottom:20px;">
                <span class="sp2" style="margin-left: 60%;position: absolute;left: 40px;top: 124px;">服务单号：<text style="">{$res.tong_number}</text></span>
            </div>
        </div>
        <p style="font-size: 13px;width: 100%;text-align: center;margin-bottom: 0;padding: 10px;padding-top: 20px;">鉴于车辆所有人提出参加交通安全服务申请，并同意按约定支付服务金，依照参加交通安全服务的项目及对应条款和特别约定承担补偿责任。</p>
        <table border="1px" cellspacing="0" cellpadding="0">
            <tr>
                <td>被服务人</td>
                <td colspan="2">{$res.learned_name}</td>
                <td colspan="2">身份证号/统一社会信用代码</td>
                <td colspan="2">{$res.learned_num}</td>
            </tr>
            <tr>
                <td rowspan="4">服务车辆情况</td>
                <td>号码号牌</td>
                <td>{$res.car_num}</td>
                <td>厂牌型号</td>
                <td colspan="3">{$res.car_factory_num}</td>
            </tr>
            <tr>
                <td>VIN码/车架号</td>
                <td colspan="2">{$res.car_vin}</td>
                <td>发动机号</td>
                <td colspan="2">{$res.car_engine}</td>
            </tr>
            <tr>
                <td>初次登记日期</td>
                <td>{$res.car_register|date='Y-m-d',###}</td>
                <td>排量/功率</td>
                <td>{$res.car_displacement}/{$res.car_power}</td>
                <td>核定载质量</td>
                <td style="text-align: center;">{$res.car_carry_quality}千克</td>
            </tr>
            <tr>
                <td>车辆种类</td>
                <td>
                    <?php if($res['chexing'] == "货车"){?>
                    2吨以上货车
                    <?php }else if($res['chexing'] == "2吨以下"){ ?>
                    2吨以下货车
                    <?php }else{ ?>
                    {$res.chexing|default="/"}
                    <?php }?>
                </td>
                <td>使用性质</td>
                <td>{$res.car_use_nature_str|default="/"}</td>
                <td>核定载客</td>
                <td style="text-align: center;">{$res.car_carry_peo}人</td>

            </tr>
            <tr>
                <td colspan="3">服务种类</td>
                <td>不计免赔</td>
                <td colspan="2">服务金额/责任限额（元）</td>
                <td colspan="1">服务费（元）</td>
            </tr>
            {foreach name="tc_list" item="tc_vo"}
            <tr>
                {eq name="tc_vo.tczl" value="不计免赔服务"}
                {if $tc_vo['tcf'] > 0}
                <td colspan="3">{$tc_vo['tczl']|default="/"}</td>
                <td></td>
                <td colspan="2"></td>
                <td colspan="1">{$tc_vo.tcf|default="/"}</td>
                {/if}
                {else}
                <td colspan="3"><?php echo str_replace("服务","服务",$tc_vo['tczl']);?></td>
                <td>
                    {if  condition="$tc_vo.bjmp eq 1"} 是
                    {elseif condition="$tc_vo.bjmp eq 2"/}/
                    {else/}/{/if}
                </td>
                <td colspan="2">{$tc_vo.money|default="/"}</td>
                <td colspan="1">{$tc_vo.tcf|default="/"}</td>
                {/eq}
            </tr>
            {/foreach}

            {php}
            for($n=1;$n<=$line;$n++){
            {/php}
            <tr>
                <td colspan="3"></td>
                <td></td>
                <td colspan="2"></td>
                <td colspan="1"></td>
            </tr>
            {php}
            }
            {/php}
            <tr>
                <td colspan="7" style="text-align: left;">服务费合计（人民币大写）:<div id="daxie" style="display: inline-block;"></div><font style="width: 100px;margin-left: 30%; float: right;" >(￥: <div style="display: inline-block" id="money">{$res.main_free}</div>元)</font></td>
            </tr>
            <tr>
                <td colspan="7" style="text-align: left;">服务期间 &nbsp;自&nbsp;&nbsp;&nbsp;
                    {$res.plan_strattime|date='Y-m-d H:i:s',###} 时起&nbsp;至&nbsp;&nbsp;
                    <?php $jie = $res['plan_endtime']- strtotime(date('Y-m-d',$res['plan_endtime']));?>
                    <?php if($jie == 86399 || $jie == 0){?>
                    <!--                    {$res.plan_endtime|date='Y-m-d',###}  二十四时止-->
                    {$res.plan_endtime|date='Y-m-d H:i:s',###} 时止
                    <?php }else{?>
                    {$res.plan_endtime|date='Y-m-d H:i:s',###} 时止
                    <?php }?>
                </td>
            </tr>
            <tr>
                <td style="height:80px;">
                    特别约定
                </td>
                <td colspan="6" ><?php echo str_replace("互助","服务",$res['special']);?></td>
            </tr>
            <tr>
                <td colspan="7" style="text-align: left;">
                    {if  condition="$res.resolvent eq 1"}
                    服务合同争议解决方式：诉讼
                    {elseif condition="$res.resolvent eq 2"/}
                    服务合同争议解决方式：诉讼
                    {/if}
                </td>
            </tr>
            <tr>
                <td>重要提示</td>
                <td colspan="6" style="text-align: left;">
                    1、本合同由服务条款、服务提示、服务单、服务批单和特别约定组成。<br />
                    2、收到本服务单、服务项目对应的服务条款后，请立即核对。如有不符或疏漏，请及时通知我司并办理变更或补充手续。<br />
                    3、请详细阅读服务种类相应的服务条款，特别是责任免除和责任处理。<br />
                    4、机动车因改装、加装、改变使用性质等导致危险程度显著增加以及转卖、转让、赠送他人的，应通知我司并办理变更手续。<br />
                    5、服务车辆发生交通事故后应立即通知我司。<br />
                    6、车辆发生服务事故应当先由交强险部分赔偿，不足部分依合同约定后进行补偿。<br/>
                    7、被服务人直接或间接缴纳服务费，我司即视为被服务人已知晓服务合同规定的免除我司责任条款的内容及法律后果。
                </td>
            </tr>

            <tr>
                <td>公司</td>
                <td colspan="6" class="gongsi" >
                    <span style="text-align: left !important;height: 20px;display: block;width: 50%;float: left;line-height: 20px;">公司名称：{$site.bjd_company}</span>
                    <span class="gongsi2" style="text-align: left !important;;height: 20px;display: block;width: 50%;float: left;line-height: 20px;">公司地址：{$site.bjd_address}</span>
                    <span style="text-align: left !important;;height: 20px;display: block;line-height: 20px;float: left;width: 100%;">邮编：{$site.bjd_zip_code}</span>
                    <span style="text-align: left !important;;height: 20px;display: block;width:35%;float: left;line-height: 20px;">全国统一客服电话：{$site.bjd_phone}</span>
                    <span style="text-align: left !important;;height: 20px;display: block;width:30%;float: left;line-height: 20px;">签单日期：{$res.yw_hetong_time|date='Y-m-d',###}</span>
                    <span style="text-align: left !important;;height: 20px;display: block;width:15%;float: left;line-height: 20px;">公司盖章：</span>
                </td>
            </tr>
            <tr>
                <td colspan="7" style="overflow: hidden;">
                    <span style="text-align: left;display: block;height: 20px;line-height: 20px;width: 33%;float: left;">审核：华资在线</span>
                    <span style="text-align: left;display: block;height: 20px;line-height: 20px;width: 33%;float: left;">制单：华资在线</span>
                    <span style="text-align: left;display: block;height: 20px;line-height: 20px;width: 33%;float: left;">经办：华资在线</span>
                </td>
            </tr>
        </table>
        <div style="position: relative;bottom: 210px;right: -610px;"><img src="{$site.bjd_fwz}" width="180"></div>
        <div style="margin-top: -160px;padding-bottom:0px" id="wenzhang">
            <p class="topp"></p>
            <p style="text-indent:32px;text-autospace:none;text-align:center;line-height:27px">
                <br/>
            </p>
            <p style="text-indent:193px;text-autospace:none;text-align:justify;text-justify:inter-ideograph">
            </p>
            <p style="margin-top:70px;margin-bottom:10px;text-indent:32px;text-autospace:none;text-align:center;line-height:33px">
                <span style="margin-left:-15px;text-indent:0;font-family: 宋体;font-size: 16px;font-weight:bold;padding-top:20px;padding-bottom:30px;display:block">机动车交通安全综合服务条款</span>

            </p>
            <?php echo $tiaokuan['content'];?>
            {if !$sign}
            <p style="text-indent:244px">
                <span style="font-family: 宋体;font-size: 19px">被服务人签章处：</span><span style="text-decoration:underline;"><span style="font-family: 宋体;font-size: 19px">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></span>
            </p>
            <p style="margin-top:31px;text-indent:244px">
                <span style="font-family: 宋体;font-size: 19px"><span style="font-family:宋体">日期：</span> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;年 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;月 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;日</span>
            </p>
            {else}
            <p style="text-indent:244px">
                <span style="font-family: 宋体;font-size: 19px">被服务人签章处：</span><span style="text-decoration:underline;"><span style="font-family: 宋体;font-size: 19px"><img src="/{$sign.sign_pic}" alt="" style="margin-bottom: -50px;"> </span></span>
            </p>
            <p style="margin-top:31px;text-indent:244px">
                <span style="font-family: 宋体;font-size: 19px"><span style="font-family:宋体">日期：</span> &nbsp;&nbsp;&nbsp;<?php echo date('Y',strtotime($sign['sign_time']));?>&nbsp;&nbsp;年 &nbsp;&nbsp;<?php echo date('m',strtotime($sign['sign_time']));?>&nbsp;&nbsp;月 &nbsp;&nbsp;<?php echo date('d',strtotime($sign['sign_time']));?>&nbsp;&nbsp;日</span>
            </p>
            {/if}
            <p>
                <br/>
            </p>

        </div>
    </div>
    <p class="aaaaa"></p>
</div>
<style type="text/css" media="all">
    @media print {
        /* 设置每页的背景图片 */
        body {
            background-size:100%;
            background-position: center center;  /* 背景图片居中 */
            background-repeat: no-repeat;  /* 防止图片重复 */
            background-size: contain;  /* 保持图片比例，适应页面 */
            margin: 0; /* 移除页边距 */
        }

        /* 针对每一页设置样式 */
        @page {
            size: A4;  /* 自动调整纸张大小，或者可以设置为A4等 */
            margin: 27px 20px;   /* 可选，移除页面的默认边距 */
        }
    }
</style>
<script src="/assets/js/jquery-3.2.1.min.js"></script>
<script src="/assets/js/ace1.4/assets/js/layui.js"> </script>
<script>
    $(function(){
    })
    function exportPdf(btn) {
        $(btn).hide();
        $(".shangchuan").hide()
        setTimeout(function() {
            window.print();
        }, 1000);
        return false
    }
    //js  转换大写金额
    //小写转大写
    function cmycurd(num) {  //转成人民币大写金额形式
        var str1 = '零壹贰叁肆伍陆柒捌玖';  //0-9所对应的汉字
        var str2 = '万仟佰拾亿仟佰拾万仟佰拾元角分'; //数字位所对应的汉字
        var str3;    //从原num值中取出的值
        var str4;    //数字的字符串形式
        var str5 = '';  //人民币大写金额形式
        var i;    //循环变量
        var j;    //num的值乘以100的字符串长度
        var ch1;    //数字的汉语读法
        var ch2;    //数字位的汉字读法
        var nzero = 0;  //用来计算连续的零值是几个

        num = Math.abs(num).toFixed(2);  //将num取绝对值并四舍五入取2位小数
        str4 = (num * 100).toFixed(0).toString();  //将num乘100并转换成字符串形式
        j = str4.length;      //找出最高位
        if (j > 15) { return '溢出'; }
        str2 = str2.substr(15 - j);    //取出对应位数的str2的值。如：200.55,j为5所以str2=佰拾元角分

        //循环取出每一位需要转换的值
        for (i = 0; i < j; i++) {
            str3 = str4.substr(i, 1);   //取出需转换的某一位的值
            if (i != (j - 3) && i != (j - 7) && i != (j - 11) && i != (j - 15)) {    //当所取位数不为元、万、亿、万亿上的数字时
                if (str3 == '0') {
                    ch1 = '';
                    ch2 = '';
                    nzero = nzero + 1;
                }
                else {
                    if (str3 != '0' && nzero != 0) {
                        ch1 = '零' + str1.substr(str3 * 1, 1);
                        ch2 = str2.substr(i, 1);
                        nzero = 0;
                    }
                    else {
                        ch1 = str1.substr(str3 * 1, 1);
                        ch2 = str2.substr(i, 1);
                        nzero = 0;
                    }
                }
            }
            else { //该位是万亿，亿，万，元位等关键位
                if (str3 != '0' && nzero != 0) {
                    ch1 = "零" + str1.substr(str3 * 1, 1);
                    ch2 = str2.substr(i, 1);
                    nzero = 0;
                }
                else {
                    if (str3 != '0' && nzero == 0) {
                        ch1 = str1.substr(str3 * 1, 1);
                        ch2 = str2.substr(i, 1);
                        nzero = 0;
                    }
                    else {
                        if (str3 == '0' && nzero >= 3) {
                            ch1 = '';
                            ch2 = '';
                            nzero = nzero + 1;
                        }
                        else {
                            if (j >= 11) {
                                ch1 = '';
                                nzero = nzero + 1;
                            }
                            else {
                                ch1 = '';
                                ch2 = str2.substr(i, 1);
                                nzero = nzero + 1;
                            }
                        }
                    }
                }
            }
            if (i == (j - 11) || i == (j - 3)) {  //如果该位是亿位或元位，则必须写上
                ch2 = str2.substr(i, 1);
            }
            str5 = str5 + ch1 + ch2;

            if (i == j - 1 && str3 == '0') {   //最后一位（分）为0时，加上"整"
                str5 = str5 + '整';
            }
        }
        if (num == 0) {
            str5 = '零元整';
        }
        return str5;
        console.log(str5);
    }
    var nums = $('#money').html();
    var daxie = cmycurd(nums);
    $('#daxie').text(daxie);
    $('#fileInput').on('change', function() {

        // 创建一个FormData对象
        var formData = new FormData();

        // 获取选择的文件
        var file = $(this)[0].files[0];

        // 将文件添加到FormData对象中
        formData.append('file', file);
        formData.append('id', {$res.id});
        //执行相关函数
        layui.use('layer', function(){
            layer.ready(function(){
                var layer = layui.layer;
                var index = layer.load();
                // 发起AJAX请求上传文件
                $.ajax({
                    url: '/admin/conf/uploadss', // 上传文件接口的URL
                    type: 'POST',
                    data: formData,
                    processData: false,
                    contentType: false,
                    success: function(response) {
                        // 上传成功的处理逻辑
                        layer.close(index)
                        layer.msg('上传成功',{icon:1})
                        location.reload();
                        console.log(response);
                    },
                    error: function(xhr, status, error) {
                        // 上传失败的处理逻辑
                        console.log(error);
                        layer.close(index);
                        layer.msg(error,{icon:2})
                    }
                });
            })
        })

    });
</script>
<script type="text/javascript" charset="utf-8">
    var html=$(".gongsi").html()
    console.log(html)
    console.log(html.length)
    if(html.length>18){
        $(".gongsi").css("font-size","14px")
        $(".gongsi2").css("line-height","14px")
    }else{
        $(".gongsi").css("font-size","14px")
        $(".gongsi2").css("line-height","20px")
    }
</script>
<!--endprint-->
</body>


</html>
